<template>
  <div>
    <router-view />
    <van-tabbar v-model="active">
      <van-tabbar-item icon="home-o">
        <router-link to="/home">首页</router-link>
      </van-tabbar-item>
      <van-tabbar-item icon="search">
        <router-link to="/list">分类</router-link>
      </van-tabbar-item>
      <van-tabbar-item icon="shopping-cart-o">
        <router-link to="/shop">购物车</router-link>
      </van-tabbar-item>
      <van-tabbar-item icon="manager-o">
        <router-link to="/my">我的</router-link>
      </van-tabbar-item>
    </van-tabbar>
    <nav></nav>
  </div>
</template>

<script>
export default {
  data() {
    return {
      active: 0,
    };
  },
};
</script>

<style lang="scss" scoped>
* {
  margin: 0%;
  padding: 0%;
}
// nav {
//   width: 100%;
//   position: fixed;
//   bottom: 0;
//   display: flex;
//   border-top: 1px solid #ccc;
//   margin-left: -10px;
//   a {
//     margin-left: 45px;
//     margin-top: 10px;
//     margin-bottom: 10px;
//     color: black;
//     font-size: 16px;
//     text-decoration: none;
//   }
// }
</style>